import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import {ClueDataService} from '../../../../@core/service/clue-service/clue-data.service';
import{ ClueTableService}from '../../../../@core/service/clue-service/clue-table.service';
import * as moment from 'moment' 
import { TableComponent } from './table/table.component';
@Component({ 
  selector: 'app-clue',
  templateUrl: './clue.component.html',
  styleUrls: ['./clue.component.scss']
}) 
export class clueComponent implements OnInit {
  //线索来源数据
  public clueOriginList:any[];
  //线索状态数据
  public clueStatusList:any[];
  //登记机关
  public regAuthList:any;
  //地区list
  public areaList:any[];
  //
  @ViewChild('table') table:TableComponent;
  public areaData:any={
    province:{},
    city :{},
    county:{},
    showArea:null,
    lastKey:null
  } 
  //定义参数 双向绑定数据
  public clue={ 
    clueOriginValue:null,//线索来源
    clueStatus:null,//登记状态
    cluePeople:null,//登记人
    partyName:null,//当事人  
    regAuth:null,//登记机关
    clueArea:null,//线索区域
    dataStart:null,
    dataEnd:null,
    clueHandle:null
  }
  //缓存查询参数到service中
  public searchOption:any;
  //设置私有变量_dateStart
  public _dateStart: string;
   //设置私有变量_dateEnd
  public _dateEnd: string;

  //选择条目
  selectedLimit: any;
  //tableService
  clueTable: ClueTableService;
  
  //getdate
  public  dateStart:any;
  public dateEnd:any;

  //初始化构造函数  
  constructor(public clueData:ClueDataService,clueTable:ClueTableService,public el:ElementRef) { 
      this.clueOriginList = clueData.source;
      this.clueStatusList = clueData.status;
      this.regAuthList = clueData;
      this.areaList = clueData.area;
      this.clueTable = clueTable;
      this.searchOption = clueTable.searchOption;
  }

  ngOnInit() {
    let el = this.findElement(this.el.nativeElement)
    if(el.length>0&&el.length == 1){
        let h = document.documentElement.clientHeight || document.body.clientHeight;
        el[0].style.height =h-235+`px`;
    }
  }

  findElement(parent:any):any[]{
    let result:any =[];
     let next = function(parentChild){
      for (var i = 0; i < parentChild.children.length; i++) {
          if(parentChild.children[i].className =='box-body'){
            result.push(parentChild.children[i])
          }else{
            next(parentChild.children[i])
          }
      }
     }
     next(parent);
     return result;
  }
  //统一change方法调用
  onStartChange(date:any):void{
    if(date){
      let d = new Date(date);
      let datetime = moment(d).format('YYYY-MM-DD')
      this._dateStart = datetime;
    }else{
      this._dateStart = ''
    }
  }
  onCloseChange(date:any):void{
    if(date){
      let d = new Date(date);
      let datetime = moment(d).format('YYYY-MM-DD')
      this._dateEnd = datetime;
    }else{
      this._dateEnd = ''
    }
  }
  //调用查询方法
  search(){
    let options ={
      clueHandle:this.clue.clueHandle||null,
      clueOriginValue:this.clue.clueOriginValue||null,
      clueStatus:this.clue.clueStatus||null,
      clueArea:this.areaData.lastKey||null,
      cluePeople:this.clue.cluePeople||null,
      partyName:this.clue.partyName||null,
      dataStart:this._dateStart||null,
      dataEnd:this._dateEnd||null }
    this.clueTable.setOption(options)
    this.table.pageInator.onSetPageValue(1)
    this.table.goToPage({num:1,limit:this.table.selectedLimit}) 
  }

  //调用reset方法
  reset(){
    this._dateStart = '';
    this._dateEnd = '';
    this.dateStart = ''
    this.dateEnd = ''
    this.areaData.showArea = ``;
    this.areaData.lastKey = null;
    this.clue.clueHandle=null;
    this.clue.clueArea  = this.clue.clueOriginValue =null;
    this.clue.cluePeople =null;
    this.clue.partyName =null;
    this.clue.clueStatus =null;
    this.clue.dataEnd =null;
    this.clue.dataStart =null;
    this.clue.regAuth =null;
    this.search()
  }
  //设置areaSelect 
  onSelection(event):void{
    if(event){
      if(event.index == 0){
        this.areaData['province']['option'] = event.option;
        this.areaData['city']['option']  = null;
        this.areaData['county']['option']  = null;
        this.areaData.showArea = `${this.areaData['province']['option']['label']}`;
      }else if(event.index == 1){
        this.areaData['city']['option']  = event.option;
        this.areaData['county']['option']  = null;
        this.areaData.showArea = `${this.areaData['province']['option']['label']}-${this.areaData['city']['option']['label']}`;
      }else if(event.index == 2){
        this.areaData['county']['option']  = event.option;
        this.areaData.showArea = `${this.areaData['province']['option']['label']}-${this.areaData['city']['option']['label']}-${this.areaData['county']['option']['label']}`;
      }
    }else{
      this.areaData['province']['option']=null
      this.areaData['city']['option']  = null;
      this.areaData['county']['option']  = null;
      this.areaData.showArea=null;
      this.areaData.lastKey = null;
    }
  }
  //修改select传递参数
  onSelectionFn(event){
    this.areaData.lastKey =  event.pop()['key'] 
  }
  //slection清除方法
  selectionClear(){
    this.areaData['province']['option']=null
    this.areaData['city']['option']  = null;
    this.areaData['county']['option']  = null;
    this.areaData.showArea=null;
  }

  //日期框打开关闭事件
  onStartClose(event){
    if(!event){
      this.dateStart = ''
    }
    
  }
  onEndClose(event){
    if(!event){
      this.dateEnd = ''
    }
  }

}
